<template>
	<section>
		<el-dialog title="空瓶回收确认" v-model="visible" :width="800" destroy-on-close @closed="$emit('closed')">
			<el-form inline ref="dialogForm" :model="entityObj" label-width="100px">
				<el-form-item label="空瓶名称" label-width="100px">
					<el-input class="w-300 no-border" disabled v-model="entityObj.materialName"></el-input>
				</el-form-item>
				<el-form-item label="空瓶标识码" label-width="100px">
					<el-input class="w-300 no-border" disabled v-model="entityObj.materialCode"></el-input>
				</el-form-item>
				<el-form-item label="回收数量" label-width="100px">
					<el-input class="w-300 no-border" disabled v-model="entityObj.recoveryCount1"></el-input>
				</el-form-item>
				<el-form-item label="酒商确认数量" label-width="100px">
					<el-input class="w-300 no-border" disabled v-model="entityObj.recoveryCount3"></el-input>
				</el-form-item>
				<el-form-item label="供应商" label-width="100px">
					<el-select class="w-300" placeholder="---请选择供应商---" v-model="entityObj.recoverySuplyId" >
						<el-option v-for="item in entityObj.emptiesSupplierList" :key="item.supplierId" :label="item.supplierName" :value="item.supplierId" />
					</el-select>
				</el-form-item>
				<el-form-item label="集采确认数量" label-width="100px">
					<el-input-number v-model="entityObj.recoveryCount2" @change="handleChange()" @input="handleInput()" class="w-300" :step="1" min="0" controls-position="right"></el-input-number>
					<el-button type="primary" style="margin-left: 30px;" @click="openSup">拆单</el-button>
				</el-form-item>

				<el-table :data="entityObj.recoveryOrderItems" :border="true" style="width: 100%" show-summary>
				    <el-table-column label="供应商码" prop="materialCode"></el-table-column>
				    <el-table-column width="250" label="供应商" prop="recoverySuplyName"></el-table-column>
				    <el-table-column label="空瓶标识码" prop="materialBarCode"></el-table-column>
					<!-- <el-table-column label="集采确认数量" prop="recoveryCount2"></el-table-column>  -->
					<!-- 估计要做实时动态灵活操作 -->
				    <el-table-column prop="recoveryCount2" label="集采确认数量">
					  <template #default="scope">
						<el-input-number v-model="scope.row.recoveryCount2" style="width: 100%" :step="1" min="0" controls-position="right"></el-input-number>
					  </template>
				    </el-table-column>
			    </el-table>
			</el-form>
			<template #footer>
				<div style="text-align: center;">
					<el-button @click="visible = false">取消</el-button>
					<el-button type="primary" @click="submit()">确认</el-button>
				</div>
			</template>
		</el-dialog>

		<el-dialog title="重新指派供应商" v-model="visibleSup" :width="500" destroy-on-close @closed="closedSup">
			<el-form inline label-width="49px" :model="modalSup" style="margin-top: 5px">
				<el-form-item label="空瓶名称" label-width="100px">
					<el-input disabled placeholder="---请输入物料简码---" v-model="modalSup.materialName" style="width: 300px" />
				</el-form-item>
				<el-form-item label="供应商" label-width="100px">
					<el-select placeholder="---请选择状态---" v-model="modalSup.recoverySuplyId" style="width: 300px" @change="changeSelect">
						<el-option v-for="item in modalSup.emptiesSupplierList" :key="item.supplierId" :label="item.supplierName" :value="item.supplierId" />
					</el-select>
				</el-form-item>
				<el-form-item label="空瓶标识码" label-width="100px">
					<el-input placeholder="---请输入空瓶标识码---" v-model="modalSup.materialBarCode" style="width: 300px" />
				</el-form-item>
				<el-form-item label="酒业确认数量" label-width="100px">
					<el-input-number v-model="modalSup.recoveryCount2" style="width: 300px" :step="1" min="0" controls-position="right"></el-input-number>
				</el-form-item>
			</el-form>
			<template #footer>
				<div style="text-align: center;">
					<el-button @click="visibleSup = false">取消</el-button>
					<el-button type="primary" @click="submitSup()">确认</el-button>
				</div>
			</template>
		</el-dialog>
	</section>
</template>

<script>
	export default {
		emits: ["success", "closed"],
		data() {
			return {
				visible: false,
				entityObj: {},
				modalSup:{},
				visibleSup:false,
				backRecoveryCount1:0,
				backrecoveryCount2:0
			}
		},
		methods: {
			initData(data) {
				this.visible = true
				// 构造数据 entityObj modalSup
				this.entityObj = {...data}
				console.log('data:',data)
				this.entityObj.recoveryCount2 = 0
				this.entityObj.recoveryOrderItems = []
				this.modalSup = {...data}
				data.recoveryOrderItems.forEach(item => {
					if(data.materialId == item.materialId){
						this.modalSup.emptiesSupplierList = item.emptiesSupplierList
						this.entityObj.emptiesSupplierList = [...item.emptiesSupplierList ]
					}
				});
				delete this.modalSup.recoveryOrderItems
				this.backRecoveryCount1 = data.recoveryCount1
				this.backrecoveryCount2 = 0
			},
			openSup(){
				// if(this.modalSup.emptiesSupplierList.length <= 1 || this.modalSup.recoveryCount1 === 1){
				// 	this.$message.error('无需拆单')
				// 	return
				// }
				this.visibleSup = true
				this.modalSup.materialBarCode = ''
				this.modalSup.recoveryCount2 = 0
			},
			submitSup(){
				if(!this.modalSup.recoverySuplyId){
					this.$message.error('请选择供应商')
					return
				}
				if(!this.modalSup.materialBarCode){
					this.$message.error('请输入空瓶标识码')
					return
				}
				if(!this.modalSup.recoveryCount2){
					this.$message.error('请输入集采确认数量')
					return
				}
				console.log('this.modalSup:',this.modalSup)
				this.entityObj.recoveryOrderItems.push({...this.modalSup})
				this.visibleSup = false
			},
			changeSelect(event){
				this.modalSup.recoverySuplyName = this.modalSup.emptiesSupplierList.find(item => item.supplierId == event).supplierName
			},
			handleInput(){
			},
			handleChange(){
				console.log('handleChangerow.......') // 未调整
				// let tableNum = 0
				// this.entityObj.recoveryOrderItems.forEach(item => {
				// 	tableNum += item.recoveryCount2
				// });
				// console.log('tableNum:',tableNum)
				// let resultNum = this.entityObj.recoveryCount2 + tableNum
				// if(resultNum  > this.backRecoveryCount1){
				// 	this.$message.error('酒业确认数量不能大于回收数量' + this.backrecoveryCount2)
				// 	this.entityObj.recoveryCount2 = Number(JSON.parse(JSON.stringify(this.backrecoveryCount2)))
				// } else{
				// 	this.backrecoveryCount2 = Number(JSON.parse(JSON.stringify(this.entityObj.recoveryCount2)))
				// }
			},
			async submit(){
				// 判断数量
				let allaccount = 0
				this.entityObj.recoveryOrderItems.forEach(item => { allaccount += item.recoveryCount2 });
				allaccount = allaccount + this.entityObj.recoveryCount2
				// if(allaccount !== this.backRecoveryCount1){
				// 	this.$message.error('酒业确认数量总和应等于回收数量，请调整酒业确认数量谢谢')
				// 	return
				// }
				// 过滤/构造数据
				let fatherItem = { ...this.entityObj }
				let sendResult = JSON.parse(JSON.stringify(this.entityObj))
				delete fatherItem.recoveryOrderItems
				sendResult.recoveryOrderItems.push(fatherItem)
				sendResult.recoveryOrderItems = sendResult.recoveryOrderItems.map(item => { item['recoveryCount'] = item.recoveryCount2;  ;  return item; });
				// console.log('sendResult:',sendResult)
				// 确认修改
				const returnValue = await this.$API.auth.PostProcessApi.post("recovery-order/updateprocessstate",sendResult )
				if (returnValue.status == 200) {
					this.$message.success(returnValue.msg);
					this.$emit("success");
					this.visible = false;
				} else {
				    this.$message.error("操作失败:" + returnValue.msg);
				}
			}
		}
	}
</script>

<style scoped>
.centered-descriptions {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 如果需要垂直居中，则取消此行注释 */
}
.w-300{
	width: 200px;
}
</style>
